import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router';
import HomePage from '/@/views/HomePage.vue';
import LoginPage from '/@/views/LoginPage.vue';
import UserLayout from '/src/views/UserLayout.vue';

// import storage from "store";
import NProgress from 'nprogress'; // progress bar
import 'nprogress/nprogress.css';

import { useStore } from 'vuex';
import { getToken } from '/@/utils/auth.js';

import { notification } from 'ant-design-vue';
import { log } from 'console';

// 获取store变量
const vueStore = useStore();

// 定义路由规则：请求相应的路径时，展示对应的页面
const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    component: LoginPage,
  },
  {
    path: '/login',
    name: 'LoginPage',
    component: LoginPage,
  },
  {
    path: '/home',
    name: 'HomePage',
    component: HomePage,
  },
  // {
  //   path: "/about",
  //   name: "About",
  //   component: () => import("/src/views/About.vue"),
  // },
];

// 创建一个路由实例
const vueRouter = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes,
});

const whiteList = ['/login', '/auth-redirect', '/bind', '/register'];

// 每次访问路由前的处理：限制前端页面访问权限
vueRouter.beforeEach(async (to, from, next) => {
  // to // 要去的路由
  // from // 当前路由
  // next() // 放行的意思
  // 只有next()是放行，其他的诸如：next('/logon') 、 next(to) 或者 next({ ...to, replace: true })都不是放行，
  // 而是：中断当前导航，执行新的导航

  console.log('from.path=' + from.path);
  console.log('to.path=' + to.path);
  // 进度条
  NProgress.start();

  // 如果已经获取到token
  if (getToken()) {
    // 全局设置信息
    to.meta.title && vueStore.dispatch('settings/setTitle', to.meta.title);

    // 登录过就不能访问登录界面，需要中断这一次路由守卫，执行下一次路由守卫，并且下一次守卫的to是主页
    if (to.path === '/') {
      next('/home');
      NProgress.done();
    } else {
      if (vueStore.getters.roles.length === 0) {
        // 判断当前用户是否已拉取完user_info信息
        // vueStore.dispatch('GetInfo').then(() => {
        //   console.log(112233);
        //   vueStore.dispatch('GenerateRoutes').then((accessRoutes: RouteRecordRaw) => {
        //     console.log(11223311);
        // 根据roles权限生成可访问的路由表
        // vueRouter.addRoute(accessRoutes) // 动态添加可访问路由表
        // next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
        // })
        next();
        // }).catch((err: any) => {
        //   console.log(JSON.stringify(err));

        //     store.dispatch('LogOut').then(() => {
        //       // notification.error("登陆失败")
        //       next("/home")
        //     })
        //   })
      } else {
        next();
      }
    }
  } else {
    console.log(22);
    // 没有token
    if (whiteList.indexOf(to.path) !== -1) {
      // 在免登录白名单，直接进入
      next();
    } else {
      // next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
      next('/login');
      NProgress.done();
    }
  }
});

// 每次访问路由后的处理
vueRouter.afterEach(() => {
  NProgress.done();
  // NextLoading.done();
});

export default vueRouter;
